<template>
  <div class="tpl">
    <!--S表单-->
    <el-form
      ref="settingForm"
      class="setting-form"
      :rules="formDataRules"
      :model="formData"
      label-position="top"
      label-width="100px"
      style="width: 500px;"
    >
      <el-alert
        :closable="false"
        title="需要设置模板消息所属行业为： IT科技/IT软件与服务"
        type="success"
      />
      <el-form-item label="模板消息id，通用待审核通知" prop="await_check_tpl">
        <el-input v-model="formData.await_check_tpl" placeholder="模板消息id，通用待审核通知" />
      </el-form-item>
      <el-form-item label="模板消息id，通用审核结果通知" prop="result_check_tpl">
        <el-input v-model="formData.result_check_tpl" placeholder="模板消息id，通用审核结果通知" />
      </el-form-item>
      <el-button type="primary" size="small" @click="submit">一键配置</el-button>
    </el-form>
    <!--E表单-->
  </div>
</template>

<script>
export default {
  name: 'Tpl',
  props: {
    setting: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      formData: {
        await_check_tpl: '',
        result_check_tpl: ''
      },
      formDataRules: {
        await_check_tpl: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        result_check_tpl: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  watch: {
    setting() {
      const { await_check_tpl, result_check_tpl } = this.setting
      this.formData = {
        await_check_tpl,
        result_check_tpl
      }
    }
  },
  methods: {
    submit() {
      this.$post('setting/message/autoSetTplMessage')
        .then((res) => {
          const { await_check_tpl, result_check_tpl } = res.data.data
          this.formData = {
            await_check_tpl,
            result_check_tpl
          }
          this.$message.success('配置成功')
        })
    }
  }
}
</script>

<style scoped>

</style>
